<!doctype html>
<jsp:directive.page import="com.cn.ccp.bean.UserBean" />
<%@page contentType="text/html;charset=UTF-8"%>
<%@taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@taglib uri="https://ajax4jsf.dev.java.net/ajax" prefix="a4j"%>
<%@page isELIgnored="false" %>
<html >
<f:view>
<f:loadBundle var="messages" basename="messages"></f:loadBundle>
<head>
<meta charset="utf-8">
<title><h:outputText value="#{messages['system_title']}" /></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- styles -->
    <link href="<%=request.getContextPath()%>/css/bootstrap.css" rel="stylesheet">
    <link href="<%=request.getContextPath()%>/css/bootstrap-responsive.css" rel="stylesheet">
    <link href="<%=request.getContextPath()%>/css/custom.css" rel="stylesheet">
    <!--[if lt IE 9]>
      <script src="<%=request.getContextPath()%>/js/html5.js"></script>
    <![endif]-->
    <!-- Fav and touch icons -->
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="<%=request.getContextPath()%>/images/icon/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="<%=request.getContextPath()%>/images/icon/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="<%=request.getContextPath()%>/images/icon/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="<%=request.getContextPath()%>/images/icon/apple-touch-icon-57-precomposed.png">
    <link rel="shortcut icon" href="<%=request.getContextPath()%>/images/icon/favicon.png">
    <%
    String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

		UserBean users = (UserBean) session.getAttribute("userBean");
			if ((users == null) || (users.getUserName().equals(""))) {
	%>
		<jsp:forward page="../../../sessionInvalid.jsp" />
	<%
	}
	%>
</head>
<body class="bg-white" style="overflow-x:hidden;">
<a id="viewDiv"></a>
	<h:form id="formid">
		<div class="row page-head">
			<h3 class="page-title">
				<i class="n-icon-selection  n-icon-black"></i><h:outputText value="#{messages['online_page_select_title']}"/>&nbsp;&gt;&nbsp;<b><h:outputText value="#{messages['label_list']}" /></b>
			</h3>
		</div>
		<div style="margin-left: 20px;margin-right: 20px" class="content list-tab">
			<h:inputHidden value="#{selectCourseAction.strCourseName}" id="courseNameID"></h:inputHidden>
			<h:inputHidden value="#{selectCourseAction.selectCourseType}" id="selectCourseTypeID"></h:inputHidden>
			<h:inputHidden value="#{selectCourseAction.selectTeacherID}"  id="selectTeacherID"></h:inputHidden>
			<h:inputHidden value="#{selectCourseAction.selectStarLevel}" id="selectStarLevelID"></h:inputHidden>
			<h:inputHidden value="#{selectCourseAction.selectYear}" id="selectYearID"></h:inputHidden>
			<h:inputHidden value="#{selectCourseAction.selectLanguage}" id="selectLanguageID"></h:inputHidden>
			<fieldset class="form-horizontal">
				<div >
					<div class="col-lg-6" >
						<div class="input-group">
	                        <h:inputText id="name" value="#{selectCourseAction.strCourseName}" styleClass="form-control" style="width:350px" ></h:inputText>
	                        <a4j:commandLink action="#{selectCourseAction.doSearch}" styleClass="btn btn-default" reRender="listtableinfoCourse,listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID"><h:outputText value="#{messages['online_page_select_action_searche']}"/></a4j:commandLink>
	                     	<a href="#my"  data-toggle="collapse"  style="width:70px;float:right"><h:outputText value="#{messages['online_page_select_action_condition']}"/></a>
	                     	
	                     	<h:commandLink action="list" style="width:50px;float:right" >
	                     		<h:outputText value="列表" id="listText"/>
	                     		<f:param name="pageSize" value="10"/>  
	                     	</h:commandLink>
	                     </div>
                     </div>
					  <div class="collapse" id="my">
					     	<dl class="dl-horizontal" id="teacherDiv">
		                      	<dt><h:outputText value="#{messages['online_page_select_teacher_name']}"/></dt>
		                      	<dd>
		                      		<ul class="nav nav-pills">
		                      			<li class="active">
		                                    <a4j:commandLink action="#{selectCourseAction.userChange}" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID,listtableinfoCourse"><h:outputText value="#{messages['online_page_select_no_limit']}" />
		                                  		<f:param name="teacherId" value="" />
		                                    </a4j:commandLink>
		                                 </li>
		                                  <a4j:repeat var="content" value="#{selectCourseAction.teacherList}" >
		                                  	<f:verbatim>
		                                  	<li>
		                                  	</f:verbatim>
			                                  	<a4j:commandLink action="#{selectCourseAction.userChange}" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID,listtableinfoCourse"><h:outputText value="#{content.userName}" />
			                                  		<f:param name="teacherId" value="#{content.id}" />
			                                    </a4j:commandLink>
		                                    <f:verbatim>
		                                  	</li>
		                                  	</f:verbatim>
		                                  </a4j:repeat>
		                      		</ul>
		                      	</dd>
		                     </dl>
		                     
		                      <dl class="dl-horizontal">
		                      	<dt><h:outputText value="#{messages['online_page_select_release_time']}"/></dt>
		                      	<dd>
		                      		<ul class="nav nav-pills" id="releaseDiv">
		                      			<li class="active">
		                                    <a4j:commandLink action="#{selectCourseAction.releaseTimeChange}" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID,listtableinfoCourse"><h:outputText value="#{messages['online_page_select_no_limit']}" />
		                                  		<f:param name="releseTime" value="" />
		                                    </a4j:commandLink>
		                                 </li>
		                                 <a4j:repeat var="content" value="#{selectCourseAction.releaseList}" >
		                                  	<f:verbatim>
		                                  	<li>
		                                  	</f:verbatim>
			                                  	<a4j:commandLink action="#{selectCourseAction.releaseTimeChange}" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID,listtableinfoCourse"><h:outputText value="#{content.release}" />
			                                  		<f:param name="releseTime" value="#{content.release}" />
			                                    </a4j:commandLink>
		                                    <f:verbatim>
		                                  	</li>
		                                  	</f:verbatim>
		                                  </a4j:repeat>
		                      		</ul>
		                      	</dd>
		                      </dl>
		                      
		                       <dl class="dl-horizontal">
		                      	<dt><h:outputText value="#{messages['online_page_select_star_level']}"/></dt>
		                      	<dd>
		                      		<ul class="nav nav-pills" id="levelDiv">
		                      			<li class="active" >
		                                    <a4j:commandLink action="#{selectCourseAction.changeStartLevel}" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID,listtableinfoCourse"><h:outputText value="#{messages['online_page_select_no_limit']}" />
		                                  		<f:param name="startLevel" value="" />
		                                    </a4j:commandLink>
		                                 </li>
		                                 <a4j:repeat var="content" value="#{selectCourseAction.levelList}" >
		                                  	<f:verbatim>
		                                  	<li>
		                                  	</f:verbatim>
			                                  	<a4j:commandLink action="#{selectCourseAction.changeStartLevel}" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID,listtableinfoCourse"><h:outputText value="#{content.des}" />
			                                  		<f:param name="startLevel" value="#{content.level}" />
			                                    </a4j:commandLink>
		                                    <f:verbatim>
		                                  	</li>
		                                  	</f:verbatim>
		                                  </a4j:repeat>
		                      		</ul>
		                      	</dd>
		                      </dl>
		                      
		                       <dl class="dl-horizontal">
		                      	<dt><h:outputText value="#{messages['pages_resourse_type_course']}"/></dt>
		                      	<dd>
		                      		<ul class="nav nav-pills" id="specialtyDiv">
		                      			<li class="active">
		                                    <a4j:commandLink action="#{selectCourseAction.courseTypeChange}" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID,listtableinfoCourse"><h:outputText value="#{messages['online_page_select_no_limit']}"/>
		                                    </a4j:commandLink>
		                                 </li>
		                                  <a4j:repeat var="content" value="#{selectCourseAction.courseTypeList}" >
		                                  	<f:verbatim>
		                                  	<li>
		                                  	</f:verbatim>
			                                  	<a4j:commandLink action="#{selectCourseAction.courseTypeChange}" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID,listtableinfoCourse"><h:outputText value="#{content.name}" />
			                                  		<f:param name="selectCourseType" value="#{content.id}" />
			                                    </a4j:commandLink>
		                                    <f:verbatim>
		                                  	</li>
		                                  	</f:verbatim>
		                                  </a4j:repeat>
		                      		</ul>
		                      	</dd>
		                     </dl> 
		                     
		                     
		                     <dl class="dl-horizontal">
		                      	<dt><h:outputText value="#{messages['course_page_course_language_type']}"/></dt>
		                      	<dd>
		                      		<ul class="nav nav-pills" id="languageDiv">
		                      			<li class="active">
		                                    <a4j:commandLink action="#{selectCourseAction.courseLanguageChange}" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID,listtableinfoCourse"><h:outputText value="#{messages['online_page_select_no_limit']}"/>
		                                    </a4j:commandLink>
		                                 </li>
		                                  <a4j:repeat var="content" value="#{selectCourseAction.languageList}" >
		                                  	<f:verbatim>
		                                  	<li>
		                                  	</f:verbatim>
			                                  	<a4j:commandLink action="#{selectCourseAction.courseLanguageChange}" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID,listtableinfoCourse"><h:outputText value="#{content.name}" />
			                                  		<f:param name="selectLanguage" value="#{content.id}" />
			                                    </a4j:commandLink>
		                                    <f:verbatim>
		                                  	</li>
		                                  	</f:verbatim>
		                                  </a4j:repeat>
		                      		</ul>
		                      	</dd>
		                     </dl> 
		                     
					  </div>
					  
					 
					  
				</div>
			</fieldset>
			<br/>
			<div class="row-fluid list-thumbnail" id="courseIconList">
				<div>
					<a4j:outputPanel>
			     		<h:outputText value="#{selectCourseAction.strCourseList}"  escape="false" id="listtableinfo" />
			     	</a4j:outputPanel>
			    </div>
			    <h:panelGrid columns="2" styleClass="pagination pagination-right" style="align:right">
					<h:panelGrid columns="4" >
						<a4j:commandLink action="#{selectCourseAction.firstPage}" styleClass="icon-fast-backward"  reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID"></a4j:commandLink>
						<a4j:commandLink action="#{selectCourseAction.provPage}" styleClass="icon-backward" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID"></a4j:commandLink>
						<a4j:commandLink action="#{selectCourseAction.nextPage}" styleClass="icon-forward" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID"></a4j:commandLink>
						<a4j:commandLink action="#{selectCourseAction.lastPage}" styleClass="icon-fast-forward" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID"></a4j:commandLink>
					</h:panelGrid>
					<h:panelGroup>
						<a4j:outputPanel ajaxRendered="true">
							<h:inputText value="#{selectCourseAction.currentPage}" size="3" styleClass="input" style="width:20px"></h:inputText>
							<h:outputText value="/#{selectCourseAction.countPage}#{messages['label_page']}"></h:outputText>
							 
							<a4j:commandLink action="#{selectCourseAction.goCurrentPage}" reRender="listtableinfo,courseNameID,selectCourseTypeID,selectTeacherID,selectStarLevelID,selectYearID,selectLanguageID">
								<h:graphicImage value="/images/BtnPageGo.gif" style="width:26px;height:20px"></h:graphicImage>
							</a4j:commandLink>
							<h:outputText value="#{messages['label_all']}#{selectCourseAction.itemCount}#{messages['label_count']}"></h:outputText>
						</a4j:outputPanel>
					</h:panelGroup>
				</h:panelGrid>	
			</div>
		</div>
	</h:form>
	<script src="<%=request.getContextPath()%>/js/jquery-1.8.3.min.js"></script>
	<script src="<%=request.getContextPath()%>/js/bootstrap.js"></script>
	<script>
	
	
	$("#languageDiv li").each(function(){$(this).click(function(){
		$("#languageDiv li").removeAttr("class");	
		$(this).addClass("active");	
	});});
	
	 $("#specialtyDiv li").each(function(){$(this).click(function(){
		$("#specialtyDiv li").removeAttr("class");	
		$(this).addClass("active");	
	});});
	 
	 $("#teacherDiv li").each(function(){$(this).click(function(){
			$("#teacherDiv li").removeAttr("class");	
			$(this).addClass("active");	
		});});
	 
	 $("#releaseDiv li").each(function(){$(this).click(function(){
			$("#releaseDiv li").removeAttr("class");	
			$(this).addClass("active");	
		});});
	 
	 $("#levelDiv li").each(function(){$(this).click(function(){
			$("#levelDiv li").removeAttr("class");	
			$(this).addClass("active");	
		});});
	 
	 
	 $(function(){
			$('#my').on('hide', function () {});
			$('#my').on('show', function () {});
			$('#courseTableList').hide();
			//$('#formid:showIconText').hide();
			
	 })
	 var showTable = false;
	 function showIconList(){
		 if(showTable)
			 showTable = false;
		 else
			 showTable = true;
		 
		 if(showTable){
			 $('#courseIconList').hide();
		 	 $('#courseTableList').slideDown();
		 }else{
		 	 $('#courseTableList').hide();
			 $('#courseIconList').slideDown();
		 }
	 }	
	 $(document).ready(function() {
			//document.getElementById('viewDiv').scrollIntoView();
		});
	</script>
</body>
</f:view>
</html>
